<template>
  <div class="productImage" curpagename="productImage1123234343423423">
    <layoutContent>
      <template #content>
        <div class="title_tip">
          <span class="fail_info" @click="getErrData"
            ><el-icon><Warning /></el-icon>查看上传失败图片</span
          >
          <span class="tip_info" @click="oprationFun"
            ><el-icon><QuestionFilled /></el-icon>操作指南</span
          >
        </div>
        <div class="upload_moudle">
          <!-- 文件上传 -->
          <!-- <upload ref="uploadRef" v-bind="uploadDataTwo"></upload> -->
          <uploadPic v-bind="uploadDataOne" v-model="fileArr"></uploadPic>
        </div>
        <div>
          <!-- 上传列表 -->
          <!-- <productFileList></productFileList> -->
        </div>

        <div>
          <editTableMini v-bind="miniData1" :plus="false" @plusCol="plusCol" @delOne="delOne">
           
            <template #yaowei="{ scoped }">
              <div>
            
                <el-input v-model="scoped.row.yaowei" />
              </div>
            </template>
          </editTableMini>
        </div>
      </template>
    </layoutContent>
  </div>
</template>
<script lang="ts" setup>
import upload from "@/components/uploadFileMerak/index.vue";
import uploadPic from "@/components/uploadFileMerak/picUpload.vue";

import { Path } from "@/api/modules/upload.ts";
// Path.batchImgSpu

import layoutContent from "@/components/LayoutComponents/index.vue";

import productFileList from "../../a-components/productFileList/index.vue";
import { reactive, ref } from "vue";

import { uploadFieApi } from "@/api/modules/goodsArchive/batchupload/goodsImmage";

import editTableMini from "@/components/MerakEditTable/components/editTableMini/index.vue";

const uploadDataOne = reactive({
  path: Path.batchImgSpu,
    imageType: "squire",
  imageProps: { minWidth: 800, maxWidth: 1000 }
});

let fileArr = [
  {
    url: "/merak/local/business/certify/2024/0527/1716797618423802.png",
    file_url: "http://testimages.tianxuan.link/images/goods/2024/0530/QF001_LQQ04/171706321228621172.jpg",
    name:'QF001_TTT002_1333反反复复.png',
    type: "png",
    size:555771
  },
   {
    url: "/merak/local/business/certify/2024/0527/1716797621554108.png",
    file_url: "http://testimages.tianxuan.link/images/goods/2024/0530/QF001_LQQ04/171706321228621172.jpg",
    name:'QF001_TTT002_1(绿松石色).png',
    type: "png",
    size:555771
  }
];

const miniData1 = reactive({
  columnsValue: [],
  dataValue: []
});
const miniData2 = reactive({
  columnsValue: [],
  dataValue: []
});

const oprationFun = () => {
  let columns = [
    { field: "kuzi", title: "裤长" },
    { field: "yaowei", title: "腰围" },
    { field: "tunwei", title: "臀围" },
    { field: "yichang", title: "衣长" }
  ];
  let dataValue = [
    {
      kuzi: "33",
      yaowei: "33",
      tunwei: "222",
      yichang: "2222"
    },
    {
      kuzi: "33",
      yaowei: "33",
      tunwei: "222",
      yichang: "2222"
    }
  ];
  miniData1.columnsValue = columns;
  miniData1.dataValue = dataValue;

  let columns2 = [
    { field: "kuzi", title: "裤长" },
    { field: "yaowei", title: "腰围" },
    { field: "tunwei", title: "臀围" }
  ];
  let dataValue2 = [
    {
      kuzi: { value: "33", errInfo: "错误数据。。。。" },
      yaowei: "33",
      tunwei: "222"
    },
    {
      kuzi: "33",
      yaowei: "33",
      tunwei: "222"
    }
  ];
  miniData2.columnsValue = columns2;
  miniData2.dataValue = dataValue2;
};

const plusCol = () => {
  console.log("添加");
};
const delOne = index => {
  console.log("删除，，");
};
</script>
<style lang="scss" scoped>
 
</style>